//# sourceURL=http://uMapApp/UI/Tree/TreeNode
define([
    "mhjs/mhjs",
    "./Tree"
], function (
    mhjs,
    Tree
) {

    function TreeNode(option) {

        var _this = this;

        _this.ui = {};

        _this.ui.icon = new mhjs.Div({"class": "icon"});
        _this.ui.title = new mhjs.Div({"class": "title"});
        _this.ui.checkbox = new mhjs.Div({"class": "checkbox"});
        _this.ui.titleDiv = new mhjs.Div({"class": "titleDiv"});
        _this.ui.count = new mhjs.Div({"class": "count"});
        _this.ui.child = new mhjs.Div({"class": "child"});

        _this.ui.titleDiv
            .append(_this.ui.checkbox)
            .append(_this.ui.icon)
            .append(_this.ui.title)
            .append(_this.ui.count.hide());


        mhjs.Div.call(_this, option);
        _this.addClass("treeNode");

        _this.append(_this.ui.titleDiv);

    }

    var _class = TreeNode;

    mhjs.Inherit(_class, mhjs.Div);

    Object.defineProperties(_class.prototype, {
        "icon"       : {
            set: function (icon) {

                var _this = this;
                this._icon = icon;
                _this.ui.icon.css({
                    "backgroundImage": "url('" + _this.icon + "')"
                });


            },
            get: function () {
                return this._icon;
            }
        },
        "title"      : {
            set: function (title) {
                var _this = this;
                this._title = title;
                _this.ui.title.text(title);
            },
            get: function () {
                return this._title;
            }
        },
        "disable"    : {
            value: function () {
                var _this = this;
                _this.addClass("disable");
                _this.ui.titleDiv.off("click");
                _this.ui.checkbox.off("click");
            }
        },
        "layer"      : {
            set: function (layer) {
                var _this = this;

                _this.ui.checkbox.show();
                _this.ui.child.hide();
                _this.isChildLoaded = false;

                _this.ui.titleDiv.off("click");

                _this.ui.titleDiv.on("click", function () {
                    _this.activeLayer();
                });

                _this.ui.checkbox.on("click", function () {
                    _this.toggleLayer();
                });

                if (_this.autoOpen) {
                    _this.openLayer();
                }

                this._layer = layer;
            },
            get: function () {
                return this._layer;
            }
        },
        "url"        : {
            set: function (url) {
                var _this = this;
                this._url = url;
            },
            get: function () {
                return this._url;
            }
        },
        "list"       : {
            set: function (list) {
                var _this = this;

                _this.ui.checkbox.hide();

                _this.child = new Tree({"list": list});
                _this.ui.child.append(_this.child);
                _this.ui.child.show();
                _this.isChildLoaded = true;

                _this.ui.titleDiv.on("click", function () {
                    _this.toggleChild();
                });

                if (_this.autoOpen) {
                    _this.openChild();
                }

                this._list = list;
            },
            get: function () {
                return this._list;
            }
        },
        "closeChild" : {
            value: function () {

                var _this = this;
                _this.isChildOpened = false;
                _this.ui.child.slideUp();
                _this.trigger("childClose");
            }
        },
        "openChild"  : {
            value: function () {

                var _this = this;

                if (_this.isChildLoaded) {
                    _this.ui.child.slideDown();
                    _this.trigger("childOpen");

                } else {

                    // _this.ui.icon.addClass("loading");
                    //
                    // mhjs.Ajax({
                    //     url    : _this.url,
                    //     success: function (json) {
                    //         _this.ui.icon.removeClass("loading");
                    //         var tempTree = new require("./Tree")(json.data);
                    //         _this.ui.child.append(tempTree.dom);
                    //         _this.append(_this.ui.child);
                    //         _this.isChildLoaded = true;
                    //         _this.openChild();
                    //     }
                    // });

                }

            }
        },
        "toggleChild": {
            value: function () {
                var _this = this;
                if (_this.isChildOpened) {
                    _this.closeChild();
                } else {
                    _this.openChild();
                }
            }
        },
        "openLayer"  : {
            value: function () {

                var _this = this;

                if (_this.layer && !_this.layer.isOpened) {

                    _this.ui.icon.addClass("loading");

                    _this.layer.on("error", function (layer) {
                        _this.ui.icon.removeClass("loading");
                        _this.disable();
                    });

                    _this.layer.on("open", function (layer) {
                        _this.ui.icon.removeClass("loading");
                        _this.ui.checkbox.addClass("checked");
                    });
                }
            }
        },
        "activeLayer": {
            value: function () {

                var _this = this;

                if (_this.layer) {

                    if (_this.layer.isOpened) {
                        _this.layer.active && _this.layer.active();
                    } else {
                        _this.layer.on("open", function (layer) {
                            _this.layer.active && _this.layer.active();
                        });
                    }
                }
            }
        },
        "closeLayer" : {
            value: function () {

                var _this = this;

                if (_this.layer) {
                    _this.layer.close();
                }
                _this.ui.checkbox.removeClass("checked");
            }
        },
        "toggleLayer": {
            value: function () {
                var _this = this;
                if (_this.layer) {
                    _this.layer.toggle();
                }
            }
        }

    });

    return _class;

});